$editor-padding-small: 1.25 * $spacing-abs-large;
$editor-padding-large: 2 * $spacing-abs-large;

.editor {
	@include background-color("background-input");
	@include box-shadow($shadow-size-inner, "shadow-inner");
	position: relative;
	display: flex;
	flex-direction: column;
	border-radius: $border-radius-input;
}

.editor-scrollable {
	display: flex;
	flex: 1;
	flex-direction: column;
	overflow-y: auto;

	@media (max-width: $screen-desktop) {
		padding: $editor-padding-small $editor-padding-small 0 $editor-padding-small;
	}

	@media (min-width: $screen-desktop + 1px) {
		padding: $spacing-abs-large $spacing-abs-large 0 $spacing-abs-large;
	}
}

.editor-title-wrapper {
	font-weight: $font-weight-bold;
	font-size: 150%;
}

// Fill editor height
.editor-text-wrapper {
	flex: 1;
}

.editor-toolbar {
	@include background-color("background-toolbar");
	@include box-shadow(0 -1.5px 1px 0, "shadow-inner");
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: $input-height;

	@media (max-width: $screen-desktop) {
		padding: 0 $editor-padding-small 0 ($editor-padding-small - $spacing-abs-medium);
	}

	@media (min-width: $screen-desktop + 1px) {
		padding: 0 $spacing-abs-large 0 ($spacing-abs-large - $spacing-abs-medium);
	}
}

.word-count {
	@include color("text-faded");
	line-height: 1;
}

// stylelint-disable selector-class-pattern

// Fill editor height (and compensate for paragraph spacing between the title and text)
.DraftEditor-root {
	height: calc(100% - 1rem) !important; // stylelint-disable-line declaration-no-important
}

// Fill editor height
.DraftEditor-editorContainer {
	height: 100%;
}

// Placeholder text
.public-DraftEditorPlaceholder-inner {
	@include color("text-placeholder");
}

// Text editor
.editor-text-wrapper {
	// Spacing
	.DraftEditor-root {
		@media (max-width: $screen-desktop) {
			padding-bottom: $editor-padding-small;
		}

		@media (min-width: $screen-desktop + 1px) {
			padding-bottom: $editor-padding-large;
		}
	}

	// Paragraph spacing
	.public-DraftStyleDefault-block {
		margin-top: $paragraph-spacing;
	}
}
